<template>
  <div class="djs">
    <p ref="ssss">

    </p>
  </div>
</template>
<script>
    export default {
        data(){
           return {
            time:'',
            flag : false,
            dtim: this.endtime.sj,
            did: this.endtime.id,
            stock: this.endtime.stock
           }
        },
        props:{
          endtime : {
            type : Object
          }
        },
        mounted () {
          
          let time = setInterval(()=>{
               if(this.flag == true){
                   clearInterval(time)
               }
               this.timeDown()
           },1000)
          this.time_interval = time
        },
        beforeDestroy(){
          clearInterval(this.time_interval);
        },
        methods: {
          timeDown () {
               // const endTime = new Date(this.endTime)
               // const nowTime = new Date();

               let leftTime = this.endtime.sj
               let kc = this.stock
               let d = parseInt(leftTime/(24*60*60))
               let h = parseInt(leftTime/(60*60)%24)
               let m = parseInt(leftTime/60%60)
               let s = parseInt(leftTime%60)
               
                
               
               
               if(leftTime <= 0){
                  this.flag = true
                  return
                   
               }else if(d>0){
                this.$refs.ssss.innerHTML= `<span style=" color: #5bb756;font-size: .26rem;">${d}</span>天<span style=" color: #5bb756;font-size: 16px;">${h}</span style=" color: #5bb756;font-size: .26rem;">小时<span style=" color: #5bb756;font-size: .26rem;">${m}</span>分<span style=" color: #5bb756;font-size: .26rem;">${s}</span>秒`
              }else{
                this.$refs.ssss.innerHTML= `<span style=" color: #5bb756;font-size: .26rem;">${h}</span>小时<span style=" color: #5bb756;font-size: .26rem;">${m}</span>分<span style=" color: #5bb756;font-size: .26rem;">${s}</span>秒`
              }
               if(kc == 0){
                  this.flag = true
                  this.$refs.ssss.innerHTML= `商品已经抢空了~`
                  return
               }

               this.endtime.sj = this.endtime.sj - 1;
               this.$emit('ieventstart',{'did':this.endtime.sj,'index':this.did});
               
           }
        }
    }
</script>
<style scoped lang="less">
  .djs{
            height: 30px;
            margin: auto;
            text-align: center;
            line-height: 30px;
            p{
              font-size: .2rem;
              color: #fff;
            }
          }
</style>

<!-- <template>
    <span>
        <slot>
            {{time}}
        </slot>
    </span>
</template>
<script>
    export default {
        data(){
           return {
            time:''
           }
        },
        props:{
          endTime : {
            type : String
          }
        },
        mounted () {
          let time = setInterval(()=>{
               if(this.flag == true){
                   clearInterval(time)
               }
               this.timeDown()
           },500)
        },
        methods: {
          timeDown () {
               const endTime = new Date(this.endTime)
               const nowTime = new Date();
               let leftTime = parseInt((endTime.getTime()-nowTime.getTime())/1000)
               let d = parseInt(leftTime/(24*60*60))
               let h = this.formate(parseInt(leftTime/(60*60)%24))
               let m = this.formate(parseInt(leftTime/60%60))
               let s = this.formate(parseInt(leftTime%60))
               if(leftTime <= 0){
                   this.flag = true
                   this.$emit('time-end')
               }
               this.time = `${d}天${h}小时${m}分${s}秒`
           },
           formate (time) {
               if(time>=10){
                   return time
               }else{
                   return `0${time}`
               }
           }
        }
    }
</script> -->